<ion-header>
  <ion-navbar>
  </ion-navbar>
</ion-header>

<ion-content padding>
  <div class="title-box">
    <div class="title1">找回密码</div>
    <div class="title2">感谢使用blinker物联网解决方案</div>
  </div>

  <div class="login-box">
    <div class="input-box">
      <div class="item-img">
        <i class="fal fa-mobile"></i>
      </div>
      <ion-item no-padding transparent>
        <ion-label floating>请输入手机号</ion-label>
        <ion-input required type="tel" (input)="checkPhone()" minlength="11" maxlength="11" [(ngModel)]="phone"></ion-input>
      </ion-item>
      <div class="sendsms">
        <div class="v-line"></div>
        <button ion-button clear [disabled]="smscodeButtonDisabled||waiting" (click)="onSmscodeButton()">{{smscodeButton}}</button>
      </div>
    </div>
    <div class="input-box">
      <div class="item-img">
        <i class="fal fa-shield-check"></i>
      </div>
      <ion-item no-padding transparent>
        <ion-label floating>验证码</ion-label>
        <ion-input required type="number" (input)="checkAll()" check minlength="6" maxlength="6" [(ngModel)]="smscode"></ion-input>
      </ion-item>
    </div>
    <div class="input-box">
      <div class="item-img">
        <i class="fal fa-lock-alt"></i>
      </div>
      <ion-item no-padding transparent>
        <ion-label floating>密码（至少8位字符）</ion-label>
        <ion-input required type="password" (input)="checkAll()" [(ngModel)]="password"></ion-input>
      </ion-item>
    </div>
    <div class="login-btn">
      <button ion-button full round [disabled]="retrieveButtonDisabled" (click)="onRetrieveButton()">重设密码</button>
    </div>
  </div>
</ion-content>